<template>
  <div class="home">
    <div class="name">政策法规</div>
    <div class="center">
       <el-table  :data="list" @row-click="goToDetails" class="pointer">
      <el-table-column label="序号" align="center" type="index" width="150"/>
      <el-table-column label="法规标题" align="center" prop="title" />
      <el-table-column label="发布时间" align="center" prop="releaseTime" width="150">
        <template slot-scope="scope">
          <span >{{ scope.row.releaseTime }}</span>
        </template>
      </el-table-column>
    </el-table>
    <div class="page">
        <el-pagination
          background
          layout="prev, pager, next"
          :total="total"
          :page-size="pageSize"
          :current-page.sync="currentPage"
          @current-change="getList"
          hide-on-single-page
        ></el-pagination>
      </div>
    </div>
    
  </div>
</template>

<script>
import { getListByPage } from "@/api/procurement/list";
export default {
data () {
 return {
      list: [],
      currentPage: 1,
      total: 0,
      pageSize: 15,
    };
},
 mounted() {
    this.getList();
  },
computed: {},
methods: {
   // 跳转到详情页
    goToDetails(row, column, event) {
      this.$router.push({
        name: "policyDetails",
        query: {
          listId: row.listId,
        },
      });
    },
  // 获取列表
  getList() {
    getListByPage({
      pageIndex: this.currentPage,
      pageSize: this.pageSize,
      listType: 2,
    }).then((res) =>{
      this.list = res.data;
      this.total = res.total;
    })
  }
},
}
</script>

<style>
.name {
  text-align: center;
  font-size: 30px;
  font-weight: 600;
  padding: 10px 0;
}
.home {
  background-color: #fbfbfb;
  padding-bottom: 100px;
}
.page {
  float: right;
  padding: 30px 0;
}
.img {
  height: 170px;
  display: flex;
  align-items: center;
}
.el-image {
  width: 250px;
  margin-right: 40px;
  height: 100%;
}
</style>